package com.example.therDays.ui.components


import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.*
import androidx.compose.material.Icon
import androidx.compose.material.Text
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.KeyboardArrowLeft
import androidx.compose.material.icons.filled.MoreVert
import androidx.compose.material.icons.filled.Refresh
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.example.therDays.R
import com.google.accompanist.insets.LocalWindowInsets

@Composable
fun WeatherTopBar(NavPop:()->Unit) {
    //获取顶部显示栏的高度数值
    val topInsetr = LocalWindowInsets.current.statusBars.top
    //转换成为
    val stateBarDp = with(LocalDensity.current){
        topInsetr.toDp()
    }

    Box(modifier = Modifier
        .background(Color(0xFF4F7FFA))
        .fillMaxWidth()
        .height(stateBarDp + 340.dp)
        .padding(top = stateBarDp)
    ){
        Column(modifier = Modifier
            .fillMaxSize(),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.SpaceAround
        ) {
            Row(
                modifier = Modifier
                    .fillMaxWidth()
                    .height(40.dp)
                    .padding(horizontal = 8.dp),
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.SpaceBetween,
            ) {
                Icon(
                    imageVector = Icons.Default.KeyboardArrowLeft,
                    contentDescription = null,
                    modifier = Modifier.size(30.dp).clickable(indication = null, interactionSource = remember {
                        MutableInteractionSource()
                    }){
                        NavPop.invoke()
                    }
                )
                Text(text = "广东-肇庆")
                Icon(
                    imageVector = Icons.Default.MoreVert,
                    contentDescription = null,
                    modifier = Modifier.size(30.dp)
                )
            }
            Column(modifier = Modifier
                .width(220.dp)
                .height(260.dp),
//                .background(Color.Red),
                horizontalAlignment = Alignment.CenterHorizontally,
                verticalArrangement = Arrangement.SpaceAround
            ) {
                Text(text = "2023年07月20日-3:30-PM")
                Image(
                    painter = painterResource(id = R.drawable.group21),
                    contentDescription =null ,
                    modifier = Modifier.size(90.dp)
                )
                Text(text = "30°C", style = TextStyle(
                    fontSize = 22.sp
                ))
                Text(text = "多云天气", style = TextStyle(
                    fontSize = 22.sp
                ))
                Row(
                    verticalAlignment = Alignment.CenterVertically
                ) {
                    Text(text = "更新实际:03:30-PM", style = TextStyle(
                        fontSize = 14.sp
                    ))
                    Icon(imageVector = Icons.Default.Refresh, contentDescription =null , modifier = Modifier.padding(start = 4.dp).size(14.dp))
                }
            }
        }
    }
}


